<template>
    <div class="slide">
      <Menu theme="dark"  accordion @on-select="select">
        <Submenu v-for="m in menu" :key="m.id" :name="m.url" >
          <template slot="title">
            <Icon :type="m.icon"></Icon>
            <div class="meenTitle">{{m.menuName}}</div>
          </template>
          <MenuItem v-for="n in m.subs" :key="n.id"  :name="n.url">{{n.menuName}}</MenuItem>
        </Submenu>
      </Menu>
    </div>
</template>
<script type="text/ecmascript-6">

    export default {
       name:"Slide",
        data() {
            return {
//              height: "500px",
              menu:[],

            }
        },
      mounted(){
        var menu = sessionStorage.getItem("menu");
        var qs = require('qs');
        this.menu = qs.parse(menu);
      },
      methods:{
        select(_name){
          console.log(_name)
          this.$router.push({path:_name})
        }
      }
    }
</script>
<style>
  .slide{
    height: 100%;
    background: #495060;
    width: 240px;
    position: fixed;
    z-index:999;
  }
  .meenTitle{
    width: 140px;
    text-align: left;
    display: inline-block;
  }
  .ivu-menu-item{
    text-align: left;
  }
</style>
